<div class="m-subheader ">
    <div class="d-flex align-items-center">
        <div class="mr-auto col-xs-6">
            <h3 class="m-subheader__title m-subheader__title--separator"><span>基础数据</span></h3>
            <span class="m-section__sub">
                系统接口信息
            </span>
        </div>
        <div class="col-xs-6 text-right">
            <button (click)="createSystemInfo()" class="btn btn-primary"> 新增</button>
        </div>
        <div class="col-xs-6 text-right">
            <button (click)="updateSystemInfo(systemInfo)" class="btn btn-primary"> 修改</button>
        </div>
        <div class="col-xs-6 text-right">
            <button (click)="deleteSystemInfo(systemInfo.id)" class="btn btn-primary" > 删除</button>
        </div>
    </div>
</div>

<div class="m-content">
    <div class="m-portlet m-portlet--mobile">
        <div class="m-portlet__body">
            <form class="horizontal-form" autocomplete="off">
                <div class="m-form m-form--label-align-right">
                    <div class="row align-items-center m--margin-bottom-10">
                        <div class="col-xl-12">
                            <div class="form-group m-form__group align-items-center">
                                <div class="input-group">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
            <div class="row align-items-center">
                <div class="primeng-datatable-container" [busyIf]="primengTableHelper.isLoading">
                        <p-table
                        #dataTable
                        (onLazyLoad)="getSystemInfoByFilter($event)"
                        [value]="primengTableHelper.records"
                        [rows]="primengTableHelper.defaultRecordsCountPerPage"
                        [paginator]="false"
                        [lazy]="true"
                        [scrollable]="true"
                        ScrollWidth="100%"
                        [responsive]="primengTableHelper.isResponsive"
                        dataKey="id"
                        [resizableColumns]="primengTableHelper.resizableColumns"
                        selectionMode="single"
                        [(selection)]="systemInfo"
                        name="edd"
                    >
                        <ng-template pTemplate="header">
                                <tr>
                                        <th style="width: 150px">
                                            接口名称
                                        </th>
                                        <th style="width: 150px">
                                            系统编号
                                        </th>
                                        <th style="width: 150px">
                                            系统名称
                                        </th>
                                        <!-- <th style="width: 150px">
                                            表名
                                        </th> -->
                                        <th style="width: 150px">
                                            备注
                                        </th>
                                    </tr>
                        </ng-template>
                        <ng-template pTemplate="body" let-record="$implicit">
                            <tr [pSelectableRow]="record">
                                    <td width="150px">
                                            {{ record.f_SYSInterfaceName }}
                                        </td>
                                        <td width="150px">
                                            {{ record.f_SystemCode }}
                                        </td>
                                        <td width="150px">
                                            {{ record.f_SystemName }}
                                        </td>
                                        <!-- <td width="150px">
                                            {{ record.f_TableName }}
                                        </td> -->
                                        <td width="150px">
                                            {{ record.f_Remark }}
                                        </td>
                            </tr>
                        </ng-template>
                    </p-table>
                    <div class="primeng-no-data" *ngIf="primengTableHelper.totalRecordsCount == 0">
                        {{ l('NoData') }}
                    </div>
                    <div class="primeng-paging-container">
                        <p-paginator
                            [rows]="primengTableHelper.defaultRecordsCountPerPage"
                            #paginator
                            (onPageChange)="getSystemInfoByFilter($event)"
                            [totalRecords]="primengTableHelper.totalRecordsCount"
                            [rowsPerPageOptions]="primengTableHelper.predefinedRecordsCountPerPage"
                        >
                        </p-paginator>
                        <span class="total-records-count">
                            {{ l('TotalRecordsCount', primengTableHelper.totalRecordsCount) }}
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- </div> -->
<createOrEditSystemInfoModal #createOrEditSystemInfoModal (modalSave)="getSystemInfoByFilter()">
</createOrEditSystemInfoModal>
